<?

include("../conn.php");
include "t-cookie.php";
$sid=$_GET['Id'];

//查询语句
$sql = "select StudentId,StudentName,Sex,Class,email,QQ,Tel,Major from student where StudentId =$sid";


$result = mysqli_query($conn, $sql);
?>
<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人资料-学生端</title>
    <link rel="stylesheet" type="text/css" href="../css/htmleaf-demo.css">
    <link rel="stylesheet" type="text/css" href="../css/nav.css">
    <link rel="stylesheet" type="text/css" href="../fonts/iconfont.css">

    <link rel="stylesheet" href="../css/bootstrap-theme.css"/>

    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <link rel="stylesheet" href="../css/bootstrap-theme.min.css"/>
    <link rel="stylesheet" href="../css/bootstrap.css"/>
    <script type="text/javascript" src="../js/bootstrap3.0.3.min.js"></script>

    <style>
        .topx {
            margin: 0px;
            padding-top: 50px;
            position: fixed;
            z-index: 999;
            /*浮动部分*/
            /*float:left; */
        }

        .navfont {
            font-family: "黑体";
            font-size: 1.5em;
            padding-top: 10px;
        }

        .indexborder {
            border: 1px transparent;
            border-color: transparent;
            border-color: rgba(0, 0, 0, 0);
            margin-left: 285px;
            margin-right: 5%;

        }

        .bodycolor {
            background-color: gainsboro;
        }

        .box-inline {
            box-shadow: 0px 2px 2px grey;
        }

        .indexdiv1 {
            margin-top: 70px;
            margin-bottom: 20px;
            /*margin-left: 0px;*/
            padding: 2% 2% 2% 2%;
            width: 100%;
            /*height:400px;*/
        }

        /*.second-div{
            margin-top: 15px;
            margin-bottom: 20px;
            margin-left: 300px;
            margin-right: 70px;
            padding: 20px 20px 20px 20px;
        }*/
        .navbackground-s {
            background-color: #0a2448;
        }

        .indexfooter {
            background-color: dimgray;
            /*height: 100px;*/
            position: absolute;
            bottom: 0px;
            width: 100%;
            float: left;
        }

        .themepanel {
            font-size: 23px;
            color: darkslategrey;

            float: left;
        }

        /*.themepanel1{
            font-size: 23px;
            margin-top: -15px;
            float:left;
        }*/
        .a {
            float: right;
            margin-right: 10%;
            margin-top: 20px;
        }

        .tab {
            margin-top: 10px;
            border: 0px;
            clear: both:
        }

        /*td{
            font-size: 18px;
        }*/
        button {
            background-color: steelblue;
            font-family: "黑体";
            /*font-size: 23px;*/
            border: none;
            width: 30%;
            text-align: center;
        }

        input {
            border: 0;
        }

        #xiu {
            margin-top: 23px;
            margin-left: 100px;
        }

        img {
            margin-top: -5px;
            clear: both;
        }

        .footer-p {
            padding-top: 10px;
            padding-left: 210px;
            /*text-align: center;*/
        }

        .paneldiv {
            margin-left: 60px;
            margin-top: 20px;
            /*浮动部分*/
            float: left;
            width: 40%;
        }

        .black_overlay {
            /*  弹窗样式*/
            display: none;
            position: absolute;
            top: 0%;
            left: 0%;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index: 1001;
            -moz-opacity: 0.6;
            opacity: .60;
            filter: alpha(opacity=80);
        }

        .white_content {
            display: none;
            position: absolute;
            top: 10%;
            left: 10%;
            width: 80%;
            height: 80%;
            border: 16px solid lightblue;
            background-color: white;
            z-index: 1002;
            overflow: auto;
        }

        .white_content_small {
            display: none;
            position: absolute;
            top: 40%;
            left: 30%;
            width: 40%;
            height: 50%;
            border: 16px solid lightblue;
            background-color: white;
            z-index: 1002;
            overflow: auto;
        }

        .tablediv {
            float: left;
            width: 100%;
        }

        input {
            width: 100%;
        }

        @media screen and (max-width: 900px) {
            table {
                font-size: 1.2em;;
            }

            .a {
                display: none;
                /*margin:0 auto;
                padding-bottom: 20px;*/
            }

            /*.touxiang{
               width:80%;
               margin-left: 10%;
               margin-right: 10%;

            }	*/
            #nav {
                width: 25%;
                font-size: 0.8em;
            }

            #news {
                width: 100%;
                font-size: 70%;
            }

            .paneldiv {
                width: 100%;
                font-size: 90%;
            }

            .indexborder {
                margin-left: 35%;
                margin-right: 5%;
            }

            .footer-p {
                padding-left: 26%;
            }
        }

        @media screen and (max-width: 400px) {
            table {
                font-size: 0.7em;;
            }

            /*.a{

                margin:0 auto;
            }*/
            /*.touxiang{
               width:80%;
               margin-left: 10%;
               margin-right: 10%;

            }	*/
            #nav {
                width: 25%;
                font-size: 0.5em;
            }

            .navfont {
                font-size: 1em;
            }

            #news {
                width: 100%;
                font-size: 60%;
            }

            .paneldiv {
                width: 100%;
                font-size: 65%;
            }

            .indexborder {
                margin-left: 35%;
                margin-right: 5%;
            }

            .footer-p {
                padding-left: 26%;
            }
        }

        @media screen and (max-width: 220px) {
            table {
                font-size: 0.5em;;
            }

            /*.a{

                margin:0 auto;
            }
            .touxiang{
               width:80%;
               margin-left: 10%;
               margin-right: 10%;

            }
                #nav{
                width:25%;
            }
            .navfont {
                font-size: 1em;
            }
                #news {
                width:100%;
                font-size: 60%;
                    }
                .paneldiv{
                width:100%;
                font-size: 65%;
                    }
                .indexborder {
                margin-left: 35%;
                margin-right: 5%;
                }
                .footer-p {
                padding-left: 26%;
            }*/
        }
    </style>

</head>
<body>




<div >
    <div class="panel-default auto" align="center">

        <div class="panel-body">
            <div class="a">
                <img id="avatarPreview" src="../img/学生头像.png" title="点击更换图片">
            </div>

            <center>
                <table class="tab panel panel-default" id="table">
                    <?

                    while ($row = mysqli_fetch_array($result)) {
                        ?>
                        <tr class="c">
                            <td>学号:</td>
                            <td><input type="text" value="<?php echo $row['StudentId']?>" id="input" readonly="readonly"
                                       name="StudentId"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td>姓名:</td>
                            <td><input type="text" value="<?php echo $row['StudentName']?>" id="input1"
                                       readonly="readonly" name="StudentName"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td>性别:</td>
                            <td><input type="text" value="<?php echo $row['Sex']?>" id="input2" readonly="readonly"
                                       name="sex"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td> 班别:</td>
                            <td><input type="text" value="<?php echo $row['Class']?>" id="input3" readonly="readonly"
                                       name="class"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td>手机:</td>
                            <td><input type="text" value="<?php echo $row['Tel']?>" id="input4" readonly="readonly"
                                       name="Tel"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td>E-mail:</td>
                            <td><input type="email" value="<?php echo $row['email']?>" id="input5" readonly="readonly"
                                       name="email"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td>QQ:</td>
                            <td><input type="text" value="<?php echo $row['QQ']?>" id="input6" readonly="readonly"
                                       name="qq"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr class="c">
                            <td> 系别:</td>
                            <td><input type="text" value="<?php echo $row['Major']?>" id="input7" readonly="readonly"
                                       name="depart"/></td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>&nbsp;</td>
                        </tr>
                    <?php
                    }
                    ?>
                    <tr class="c">
                        <td></td>

                        <td>
                            <button id="edit" name="edited" onclick="change()" style="color:white">修改</button>

                            <button id="save" name="saved" value="s-manage" onclick="save(this)" style="color:white">
                                保存
                            </button>
                        </td>
                    </tr>
                </table>
            </center>
        </div>
    </div>
    <!--</center>-->

</div>
<!--<footer class="indexfooter container-fluid  bottom">
    <p class="footer-p" align="center">地址：广东省广州市从化区经济开发区高技术产业园广从南路548号 | 电话：020－87818918 邮编：510990 | 网站公安备案编号：4401840100050 粤ICP备：05085382号 站长统计</p>
</footer>-->


<script>
    window.jQuery || document.write('<script src="js/jquery-1.11.0.min.js"><\/script>')
</script>
<script type="text/javascript" src="js/nav.js"></script>
<script type="text/javascript">
    function change() {
        document.getElementById("input1").readOnly = false;
        document.getElementById("input1").style.border = "1px solid #000000";
        document.getElementById("input2").readOnly = false;
        document.getElementById("input2").style.border = "1px solid #000000";
        document.getElementById("input3").readOnly = false;
        document.getElementById("input3").style.border = "1px solid #000000";
        document.getElementById("input4").readOnly = false;
        document.getElementById("input4").style.border = "1px solid #000000";
        document.getElementById("input5").readOnly = false;
        document.getElementById("input5").style.border = "1px solid #000000";
        document.getElementById("input6").readOnly = false;
        document.getElementById("input6").style.border = "1px solid #000000";
        document.getElementById("input7").readOnly = false;
        document.getElementById("input7").style.border = "1px solid #000000";
    }

    function save(t) {
        var a = t;
        var b = a.parentNode.parentNode.parentNode.getElementsByTagName("input");

        var datas = new Array();
        for (var i = 0; i < b.length; i++) {
            datas[i] = encodeURI(b[i].value);

        }

        var msg = "您真的确定要修改吗？\n\n请确认！";
        if (confirm(msg) == true) {
            $.ajax({
                type: "GET",
                url: "manage.php",
                data: "&StudentId=" + datas[0] + "&StudentName=" + datas[1] + "&Sex=" + datas[2] + "&Class=" + datas[3] +
                "&Tel=" + datas[4] + "&email=" + datas[5] + "&QQ=" + datas[6] + "&Depart=" + datas[7] + "&saved=s-change",
                error: function (msg) {
                    return false
                },
                success: function (msg) {
                    alert(msg);
//                    myWindow = window.open("s-information.php", "_self");
                }
            });
        }

        for (var i = 0; i < b.length; i++) {
            b[i].readOnly = true;
            b[i].style.border = "0";
        }

    }
</script>
</body>

</html>